<html>
    <head>
        <title>Monitoreo de Controladores</title>
        <style type="text/css">
            html { height: 100% }
            body { height: 100%; margin: 0px; padding: 0px }
            #map_canvas { height: 100%; display:block; }
        </style>
        <script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
        <script type="text/javascript"
                src="https://maps.google.com/maps/api/js?sensor=false">
        </script>
        
     <!--para cargar la pagina cada 180 segundos-->
        <meta http-equiv=refresh content=180>
        <script type="text/javascript">

            function initialize() {
                var latlng = new google.maps.LatLng(-3.9898774573738045, -79.20441094455714); 
                // los parametros siempre se transmiten en este orden: (latitud,longitud)
                var myOptions = {
                    zoom: 15,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); 
                //almacena todas las posiciones con su controladores
                var datos = new Array();
                
                <?php for ($i = 0; $i < count($coor); $i++){  ?>  
                    var arreglo = new Array();
                         arreglo['1'] = "<?php echo $coor[$i]['latitud']; ?>";
                         arreglo['2'] = "<?php echo $coor[$i]['longitud']; ?>";
                         arreglo['3'] = "<?php echo $coor[$i]['alarma']; ?>";
                         arreglo['4'] = "<?php echo $coor[$i]['controlador']; ?>";
                         arreglo['5'] = "<?php echo $coor[$i]['nombre']; ?>";
                         datos[<?php echo $i ?>] = arreglo;
                <?php } ?>
//                    document.write(datos.length);
            for(var i=0; i<datos.length; i++){
                if(datos[i][3] == 0){
                    var marcador = new google.maps.Marker({
                      draggable: true,
                      icon: 'http://gmaps-samples.googlecode.com/svn/trunk/markers/green/blank.png',
                      position: new google.maps.LatLng(datos[i][1], datos[i][2]),
                      map: map,
                      title: datos[i][5]
                  });
                }else{
                    var marcador = new google.maps.Marker({
                      draggable: true,
                      icon: '',
                      position: new google.maps.LatLng(datos[i][1], datos[i][2]),
                      map: map,
                      title: datos[i][5]
                  });
                }     
            }
                
                
                 
                
                

//                $.doc("", function () {
//                    var address = document.getElementById("address").value;
//                    geocoder.geocode( { 'address': address}, function(results, status) {
//                        if (status == google.maps.GeocoderStatus.OK) {
//                            map.setCenter(results[0].geometry.location);
//                            var marker = new google.maps.Marker({
//                                map: map,
//                                position: results[0].geometry.location
//                            });
//                        } else {
//                            alert("Geocode was not successful for the following reason: " + status);
//                        }
//                    });
//                })
                
                
//                $.get("sitemap.php", function (xml) {
//                    $(xml).find("marker").each(function () { /*loop*/
//
//                        var lat = $(this).attr('lat');
//                        var lng = $(this).attr('lng');
//                        var title = $(this).attr('title');
//                        var content = $(this).attr('content');
//                        var icon = $(this).attr('icon');
//                        var id = $(this).attr('id');
//
//                        var infoWindow = new google.maps.InfoWindow({
//                            content: content
//                        });
//
//                        var marcador = new google.maps.Marker({
//                            position: new google.maps.LatLng(lat, lng),
//                            map: map,
//                            title: title,
//                            icon: icon
//                        })
//
//                    });/** end loop*/ 
//                    
//
//                }); /* end document ready*/
                
            }
//        );

            


        </script>
        
    </head>

    <body onload="initialize()">
        <div id="map_canvas"></div>
        
        <?php // print_r(count($coor));
//        var_dump($coor); ?>
        
<!--        <div>
  
            <input id="address" type="textbox" value="Sydney, NSW">
            <input type="button" value="Endoce" onclick="codeAddress()">-->
        </div>
    
    
    </body>
</html>
